<div style="margin-left: 100px; margin-top: 30px">
  <nz-upload
    [nzAction]="actionUrl"
    nzListType="picture-card"
    [(nzFileList)]="fileList"
    [nzShowButton]="fileList.length < 8"
    [nzPreview]="handlePreview"
    [nzData]="{ type: 11 }"
    (nzChange)="handleChange2($event)"
  >
    <div>
      <span nz-icon nzType="plus"></span>
      <div style="margin-top: 8px">上传</div>
    </div>
  </nz-upload>

  <nz-modal
    nzWidth="45%"
    nzCentered
    [nzVisible]="previewVisible"
    [nzContent]="modalContent"
    [nzFooter]="null"
    (nzOnCancel)="previewVisible = false"
  >
    <ng-template #modalContent>
      <img style="margin-top: 15px" [src]="previewImage" [ngStyle]="{ width: '100%', height: '100%' }" />
    </ng-template>
  </nz-modal>
</div>

<div style="float: left">
  <button nz-button nzType="primary" (click)="save()">保存</button>
  <button nz-button style="margin-right: 8px" (click)="save()">取消</button>
</div>

<p> </p>

<p>{{ this.fileList | json }}</p>
